﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name='robots' content='all, follow' />
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <title>SCIA: Control Integral de Afectaciones</title>
    <link href="public/css/default.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="public/css/style.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="public/css/datePicker.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="public/css/wysiwyg.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="public/css/fancybox-1.3.1.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="public/css/visualize.css" rel="stylesheet" type="text/css" media="screen" />
    <script type="text/javascript" src="public/js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="public/js/jquery.dimensions.min.js"></script>
    <!-- // Tabs // -->
    <script type="text/javascript" src="public/js/ui.core.js"></script>
    <script type="text/javascript" src="public/js/jquery.ui.tabs.min.js"></script>
    <!-- // Tablas y columnas // -->
    <script type="text/javascript" src="public/js/tablednd.js"></script>
    <!-- // Date Picker // -->
    <script type="text/javascript" src="public/js/date.js"></script>
    <!--[if IE]><script type="text/javascript" src="public/js/jquery.bgiframe.js"></script><![endif]-->
    <script type="text/javascript" src="public/js/jquery.datePicker.js"></script>
    <!-- // Editor Wysiwyg // -->
    <script type="text/javascript" src="public/js/jquery.wysiwyg.js"></script>
    <!-- // Graphs // -->
    <script type="text/javascript" src="public/js/jquery.visualize.js"></script>
    <!-- // Fancybox // -->
    <script type="text/javascript" src="public/js/jquery.fancybox-1.3.1.js"></script>
    <!-- // File upload // -->
    <script type="text/javascript" src="public/js/jquery.filestyle.js"></script>
    <script type="text/javascript" src="public/js/init.js"></script>
</head>
<body>
    <div id="main">
        <!-- #header -->
        <div id="header">
            <!-- #logo -->
            <div id="logo">
                <a href="index.html"><span>Control de Obras</span></a>
            </div>
            <!-- /#logo -->
            <!-- #user -->
            <div id="user">
                <h2>
                    Guitarron Primero <span>(admin)</span></h2>
                <a href="">7 mensajes</a> - <a href="">configuración</a> - <a href="index.html">logout</a>
            </div>
            <!-- /#user -->
        </div>
        <!-- /header -->
        <!-- #content -->
        <div id="content">
            <!-- breadcrumbs -->
            <div class="breadcrumbs">
                <ul>
                    <li><a href="#">Inicio</a></li>
                    <li><a href="#">Categoría</a></li>
                    <li class="active">Tablero</li>
                </ul>
            </div>
            <!-- /breadcrumbs -->
            <!-- box -->
            <div id="tabs-statistic" class="box">
                <ul class="bookmarks">
                    <li><a href="#tabs1">Solicitudes</a></li>
                    <li><a href="#tabs2">Obras</a></li>
                    <li><a href="#tabs3">Afectados</a></li>
                </ul>
                <div class="box-content">
                    <div id="tabs1">
                        <table width="100%" border="0" cellspacing="5" cellpadding="0">
                            <tr>
                                <td width="30%">
                                    <img src="public/images/graphs.jpg" alt="" width="200" height="180" />
                                </td>
                                <td>
                                    <table class="tab tab-drag">
                                        <tr class="top nodrop nodrag">
                                            <th class="dragHandle">
                                                &nbsp;
                                            </th>
                                            <th>
                                                Solicitudes Totales
                                            </th>
                                            <th class="action">
                                                Cantidad
                                            </th>
                                        </tr>
                                        <tr>
                                            <td class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales recibidas
                                            </td>
                                            <td class="action">
                                                3128
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="33" class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales atendidas
                                            </td>
                                            <td class="action">
                                                23
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </div>
                    <div id="tabs2">
                        <table width="100%" border="0" cellspacing="5" cellpadding="0">
                            <tr>
                                <td width="30%">
                                    <img src="public/images/graphs.jpg" alt="" width="200" height="180" />
                                </td>
                                <td>
                                    <table class="tab tab-drag">
                                        <tr class="top nodrop nodrag">
                                            <th class="dragHandle">
                                                &nbsp;
                                            </th>
                                            <th>
                                                Solicitudes Totales
                                            </th>
                                            <th class="action">
                                                Cantidad
                                            </th>
                                        </tr>
                                        <tr>
                                            <td class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales recibidas
                                            </td>
                                            <td class="action">
                                                12228
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales atendidas
                                            </td>
                                            <td class="action">
                                                222
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </div>
                    <div id="tabs3">
                        <table width="100%" border="0" cellspacing="5" cellpadding="0">
                            <tr>
                                <td width="30%">
                                    <img src="public/images/graphs.jpg" alt="" width="200" height="180" />
                                </td>
                                <td>
                                    <table class="tab tab-drag">
                                        <tr class="top nodrop nodrag">
                                            <th class="dragHandle">
                                                &nbsp;
                                            </th>
                                            <th>
                                                Solicitudes Totales
                                            </th>
                                            <th class="action">
                                                Cantidad
                                            </th>
                                        </tr>
                                        <tr>
                                            <td class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales recibidas
                                            </td>
                                            <td class="action">
                                                128
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="dragHandle">
                                                &nbsp;
                                            </td>
                                            <td>
                                                Totales atendidas
                                            </td>
                                            <td class="action">
                                                2
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <!-- box-content -->
            </div>
            <!-- /box -->






            <!-- box columnas-->
            <div class="box-cols">
                <div class="box box-col">
                    <div class="headlines">
                        <h2>
                            <span>Obras por sector</span></h2>
                    </div>
                    <div class="box-content">
                        <img src="public/images/graphs2.jpg" alt="" width="100%" />
                    </div>
                </div>
                <div class="box box-col box-last">
                    <div class="headlines">
                        <h2>
                            <span>Obras por solicitante</span></h2>
                    </div>
                    <div class="box-content">
                        <img src="public/images/graphs2.jpg" alt="" width="100%" />
                    </div>
                </div>
            </div>
            <!--/box columnas-->
            <!-- box columnas-->
            <div class="box-cols">
                <div class="box box-col">
                    <div class="headlines">
                        <h2>
                            <span>Obras prioritarias</span></h2>
                    </div>
                    <div class="box-content">
                        <img src="public/images/graphs2.jpg" alt="" width="100%" />
                    </div>
                </div>
                <div class="box box-col box-last">
                    <div class="headlines">
                        <h2>
                            <span>Obras prioritarias por solicitante</span></h2>
                    </div>
                    <div class="box-content">
                        <img src="public/images/graphs2.jpg" alt="" width="100%" />
                    </div>
                </div>
            </div>
            <!--/box columnas-->
            <!-- box -->
            <div class="box">
                <div class="headlines">
                    <h2>
                        <span>Ultimas obras atendidas</span></h2>
                    <a href="#" class="show-filter">Filtrar datos</a>
                </div>
                <!-- Filtrar datos -->
                <div class="filter">
                    <input type="text" value="columna 1" title="columna 1" class="input" />
                    <input type="text" value="columna 2" title="columna 2" class="input" />
                    <input type="text" value="columna 3" title="columna 3" class="input" />
                    <input type="submit" value="Filtrar" class="submit" />
                </div>
                <!-- /Filtrar datos -->
                <!-- table -->
                <table class="tab tab-drag">
                    <tr class="top nodrop nodrag">
                        <th class="dragHandle">
                            &nbsp;
                        </th>
                        <th>
                            Column 2
                        </th>
                        <th>
                            Column 3
                        </th>
                        <th class="action">
                            Acción
                        </th>
                    </tr>
                    <tr>
                        <td class="dragHandle">
                            &nbsp;
                        </td>
                        <td>
                            Datos de la tabla 1
                        </td>
                        <td>
                            Datos de la tabla 1
                        </td>
                        <td class="action">
                            <a href="" class="ico ico-delete">Borrar</a> <a href="" class="ico ico-edit">Editar</a>
                        </td>
                    </tr>
                    <tr>
                        <td class="dragHandle">
                            &nbsp;
                        </td>
                        <td>
                            Datos de la tabla 2
                        </td>
                        <td>
                            Datos de la tabla 2
                        </td>
                        <td class="action">
                            <a href="" class="ico ico-delete">Borrar</a> <a href="" class="ico ico-edit">Editar</a>
                        </td>
                    </tr>
                    <tr>
                        <td class="dragHandle">
                            &nbsp;
                        </td>
                        <td>
                            Datos de la tabla 3
                        </td>
                        <td>
                            Datos de la tabla 3
                        </td>
                        <td class="action">
                            <a href="" class="ico ico-delete">Borrar</a> <a href="" class="ico ico-edit">Editar</a>
                        </td>
                    </tr>
                    <tr>
                        <td class="dragHandle">
                            &nbsp;
                        </td>
                        <td>
                            Datos de la tabla 4
                        </td>
                        <td>
                            Datos de la tabla 4
                        </td>
                        <td class="action">
                            <a href="" class="ico ico-delete">Borrar</a> <a href="" class="ico ico-edit">Editar</a>
                        </td>
                    </tr>
                    <tr>
                        <td class="dragHandle">
                            &nbsp;
                        </td>
                        <td>
                            Datos de la table cinco
                        </td>
                        <td>
                            Datos de la table cinco
                        </td>
                        <td class="action">
                            <a href="" class="ico ico-delete">Borrar</a> <a href="" class="ico ico-edit">Editar</a>
                        </td>
                    </tr>
                </table>
                <!-- /table -->
                <!-- box-action -->
                <div class="tab-action">
                    <select class="select">
                        <option>Selecciona una acción</option>
                        <option>Editar</option>
                        <option>Borrar</option>
                    </select>
                    <input type="submit" value="Aplicar acción" class="submit" />
                </div>
                <!-- /box-action -->
                <!-- /pagination -->
                <div class="pagination">
                    <ul>
                        <li class="graphic first"><a href=""></a></li>
                        <li class="graphic prev"><a href=""></a></li>
                        <li><a href="">1</a></li>
                        <li class="active"><a href="">2</a></li>
                        <li><a href="">3</a></li>
                        <li><a href="">4</a></li>
                        <li><a href="">5</a></li>
                        <li class="graphic next"><a href=""></a></li>
                        <li class="graphic last"><a href=""></a></li>
                    </ul>
                    <p>
                        Página 1 de 5</p>
                </div>
                <!-- /pagination -->
            </div>
            <!-- /box -->
            <!-- box -->
            <div class="box">
                <div class="headlines">
                    <h2>
                        <span>Galería de obras afectadas</span></h2>
                </div>
                <div class="box-content">
                    <!-- gallery -->
                    <div class="gallery">
                        <div class="item">
                            <div class="thumb">
                                <a href="public/content-images/img-01-orig.jpg" class="fancy" rel="group">
                                    <img src="public/content-images/img-01.jpg" alt="" /></a></div>
                            <div class="tools">
                                <a href="#" class="ico ico-edit"></a><a href="#" class="ico ico-delete"></a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="thumb">
                                <a href="public/content-images/img-02-orig.jpg" class="fancy" rel="group">
                                    <img src="public/content-images/img-02.jpg" alt="" /></a></div>
                            <div class="tools">
                                <a href="#" class="ico ico-edit"></a><a href="#" class="ico ico-delete"></a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="thumb">
                                <a href="public/content-images/img-01-orig.jpg" class="fancy" rel="group">
                                    <img src="public/content-images/img-01.jpg" alt="" /></a></div>
                            <div class="tools">
                                <a href="#" class="ico ico-edit"></a><a href="#" class="ico ico-delete"></a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="thumb">
                                <a href="public/content-images/img-02-orig.jpg" class="fancy" rel="group">
                                    <img src="public/content-images/img-02.jpg" alt="" /></a></div>
                            <div class="tools">
                                <a href="#" class="ico ico-edit"></a><a href="#" class="ico ico-delete"></a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="thumb">
                                <a href="public/content-images/img-01-orig.jpg" class="fancy" rel="group">
                                    <img src="public/content-images/img-01.jpg" alt="" /></a></div>
                            <div class="tools">
                                <a href="#" class="ico ico-edit"></a><a href="#" class="ico ico-delete"></a>
                            </div>
                        </div>
                    </div>
                    <!-- /gallery -->
                </div>
                <!-- /box-content -->
            </div>
            <!-- /box -->
        </div>
        <!-- /#content -->
        <!-- #sidebar -->
        <div id="sidebar">
            <!-- mainmenu -->
            <ul id="floatMenu" class="mainmenu">
                <li class="first"><a href="panelcontrol.html">Tablero de Control</a></li>
                <li><a href="#">Usuario</a>
                    <ul class="submenu">
                        <li><a href="#">Opción 1</a></li>
                        <li><a href="#">Opción 2</a></li>
                        <li><a href="#">Opción 3</a></li>
                    </ul>
                </li>
                <li><a href="#">Solicitudes</a></li>
                <li><a href="#">Concentrado</a>
                    <ul class="submenu">
                        <li><a href="#">Opción 1</a></li>
                        <li><a href="#">Opción 2</a></li>
                        <li><a href="#">Opción 3</a></li>
                    </ul>
                </li>
                <li><a href="#">Catálogos</a>
                    <ul class="submenu">
                        <li><a href="#">Opción 1</a></li>
                        <li><a href="#">Opción 2</a></li>
                        <li><a href="#">Opción 3</a></li>
                    </ul>
                </li>
                <li class="last"><a href="#">Administración</a></li>
            </ul>
            <!-- /.mainmenu -->
        </div>
        <!-- /#sidebar -->
        <!-- #footer -->
        <div id="footer">
            <p>
                © 2012 PEMEX Exploración y Producción | <a href="#main">Inicio</a></p>
        </div>
        <!-- /#footer -->
        <!-- MODAL WINDOW -->
        <div id="modal" class="modal-window">
            <h2>
                Example modal window</h2>
            <!-- Warning form message -->
            <div class="form-message warning">
                <p>
                    On the page the following error occurred.</p>
            </div>
            <p>
                Suspendisse et ante vitae turpis vestibulum fermentum nec nec elit. Suspendisse
                ullamcorper lacus in arcu mollis fringilla porta mi placerat. Ut at elit non diam
                tristique scelerisque.
            </p>
        </div>
        <!-- HELP WINDOW -->
        <div id="help" class="modal-window">
            <h2>
                Example help window</h2>
            <p>
                Suspendisse et ante vitae turpis vestibulum fermentum nec nec elit. Suspendisse
                ullamcorper lacus in arcu mollis fringilla porta mi placerat. Ut at elit non diam
                tristique scelerisque.
            </p>
            <ul class="list list-square">
                <li><strong>Lorem ipsum</strong> dolor sit amet</li>
                <li><strong>consectetur adipiscing</strong> elit phasellus et risus</li>
                <li><strong>Maecenas non</strong> nunc proin eleifend viverra sapien</li>
            </ul>
        </div>
    </div>
    <!-- /#main -->
</body>
</html>
